<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title></title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <style type="text/css">
     *{
       margin: 0;
       padding: 0;
     }
     html,body{
       width: 100%;
     }
     a{
       text-decoration: none;
       color: gray;
     }
     /*header*/
     header{
       width: 100%;
       height: 1rem;
       background: gold;
       font-size: 0.2rem;

       position: fixed;
       top: 0;

       z-index: 1;
     }
     #head{
       width: 100%;
       height: 100%;
       display: flex;
       justify-content: space-between;
       text-align: center;
       align-items: center;

     }
     .head1>img{
       width: 0.4rem;
       height: 0.4rem;
     }
     .head2{
       font-size: 0.3rem;
       font-weight: 600;
     }
     .head3>img{
       width: 0.4rem;
       height: 0.4rem;
     }

     /*footer*/
		 	footer{
		 		position: fixed;
		 		bottom: 0;
		 		left: 0;

		 		width: 100%;
		 		height: 1rem;
		 		background: rgba(246,246,246,.95);
		 	}
		 	#foot{
		 		display: flex;
		 		width: 100%;
		 		height: 100%;

		 		font-size: 0.25rem;
		 		color: gray;
		 		justify-content: space-around;
		 		align-items: center;


		 	}
		 	#foot>a{
		 		/*flex-grow: 1;*/
		 		flex-basis: 25%;
		 		height: 0.8rem;

		 		text-align: center;
		 		align-items: flex-start;
		 	}

		 	#foot img{
		 		width: 0.5rem;
		 		height: 0.5rem;
		 	}

		 </style>
  </head>
  <body>
    <!-- <header>
			<div id="head">
				<div class="head1">
					<img src="images/saoyisao.png"/>
					<p>扫一扫</p>
				</div>
				<div class="head2">
					<p>北京市昌平区三期百货</p>
				</div>
				<div class="head3">
					<img src="images/sousuo.png"/>
					<p>搜 索</p>
				</div>
			</div>
		</header> -->


    <!--主体  -->
    <div id="main">

    </div>

    <footer>
			<div id="foot">
        <a href="#home">
  				<div class="foot1">
  					<img src="images/zhuye1.png" alt="" />
  					<p>首页</p>
  				</div>
        </a>
        <a href="#shangou">
  				<div class="foot2">
  					<img src="images/shangou.png" alt="" />
  					<p>闪送超市</p>
  				</div>
        </a>
        <a href="#login1" id="login1">
  				<div class="foot3">
  					<img src="images/gouwuche.png" alt="" />
  					<p>购物车</p>
  				</div>
        </a>
        <a href="#login2" id="login2">
  				<div class="foot4">
  					<img src="images/my1.png" alt="" />
  					<p>我的</p>
  				</div>
        </a>
			</div>
		</footer>
  </body>

  <script type="text/javascript" src="libs/requirejs.js" data-main='main' async="true" defer>
  </script>
 <!--rem-->
 <script type="text/javascript">
           (function(doc, win) {
         var docEl = doc.documentElement,
           resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
           recalc = function() {
             var clientWidth = docEl.clientWidth;
             if(!clientWidth) return;
             if(clientWidth == 640) {
               docEl.style.fontSize = '100px';
             } else {
               docEl.style.fontSize = 100 * (clientWidth / 640) + 'px';
             }
           };

         if(!doc.addEventListener) return;
         win.addEventListener(resizeEvt, recalc, false);
         doc.addEventListener('DOMContentLoaded', recalc, false);
       })(document, window);
 </script>
</html>
